<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class="easyui-layout" fit="true">
	<div region="center" border="false" style="overflow: hidden;">
		<div id="toolbar" class="datagrid-toolbar" style="height: auto;">
			<fieldset>
				<legend>筛选</legend>
				<table class="tableForm">
					<tr>
						<th>用户名称</th>
						<td colspan="2"><input id="testName" name="name" style="width: 305px;" />
						</td>
					</tr>
					<tr>
						<th>创建时间</th>
						<td colspan="2"><input name="createdatetimeStart" class="easyui-datetimebox" editable="false" style="width: 150px;" />-<input name="createdatetimeEnd" class="easyui-datetimebox" editable="false" style="width: 150px;" />
						</td>
					</tr>
					<tr>
						<th>最后修改时间</th>
						<td><input name="modifydatetimeStart" class="easyui-datetimebox" editable="false" style="width: 150px;" />-<input name="modifydatetimeEnd" class="easyui-datetimebox" editable="false" style="width: 150px;" /></td>
						<td><a class="easyui-linkbutton" iconCls="icon-search" plain="true" onclick="searchFun();" href="javascript:void(0);">查找</a><a class="easyui-linkbutton" iconCls="icon-search" plain="true" onclick="clearFun();" href="javascript:void(0);">清空</a>
						</td>
					</tr>
				</table>
			</fieldset>
			<div>
				<a class="easyui-linkbutton" iconCls="icon-add" onclick="append();" plain="true" href="javascript:void(0);">增加</a> 
				<a class="easyui-linkbutton" iconCls="icon-remove" onclick="removeFun();" plain="true" href="javascript:void(0);">删除</a> 
				<a class="easyui-linkbutton" iconCls="icon-edit" onclick="edit();" plain="true" href="javascript:void(0);">编辑</a> 
				<a class="easyui-linkbutton" iconCls="icon-undo" onclick="unselectAll();" plain="true" href="javascript:void(0);">取消选中</a>
			</div>
		</div>
		<table id="datagrid"></table>
	</div>

	<div id="actDialog" style="display: none;overflow: hidden;">
		<form id="actForm" method="post">
			<input type="hidden" id="id" name="activity.id"/>
			<div class="row">
				<label class="field">活动分类
				</label>
				<div class="item">
					<select id="type" class="basic-input" name="activity.typeCode">
						<option value="请选择">请选择</option>
						<option value="羽毛球">羽毛球</option>
						<option value="桌球">桌球</option>
						<option value="游泳">游泳</option>
					</select>
					<select id="subtype" class="basic-input hide" name="subtype" style="display:none">
					</select>
				</div>
			</div>
			<div class="row">
				<label class="field">活动标题
				</label>
				<div class="item">
					<input id="title" class="basic-input" name="activity.title" maxlength="70" size="46"/>
				</div>
			</div>
			      
			<div class="row">
				<label class="field">活动地点
				</label>
				<div class="item">
					<input id="address" class="basic-input" name="activity.address" maxlength="70" size="46"/>
				</div>
			</div>
			<div class="row">
				<label class="field">开始时间
				</label>
				<div class="item">
					<input id="startTime" name="activity.startTime" width="150px"></input>
				</div>
			</div>
			<div class="row">
				<label class="field">结束时间
				</label>
				<div class="item">
					<input id="endTime" name="activity.endTime"></input>
				</div>
			</div>
			<div class="row">
				<label class="field">活动详情
				</label>
				<div class="item">
					<textarea clas="basic-input" rows="10" cols="42" max_length="4000"></textarea>
				</div>
			</div>
		</form>
	</div>
	<script type="text/javascript" charset="UTF-8">
	var datagrid;
	var actDialog;
	var actForm;
	$(function() {
		actForm = $('#actForm').form();
		$('#startTime').datetimebox({});
		$('#endTime').datetimebox({});
		actDialog = $('#actDialog').show().dialog({
			modal : true,
			title : '活动信息',
			buttons : [ {
				text : '确定',
				handler : function() {
					if(actForm.find('#id').val()){
						actForm.form('submit', {
							url : '/activity/update',
							success : function(data) {
								try {
									var d = $.parseJSON(data);
									if (d) {
										actDialog.dialog('close');
										$.messager.show({
											msg : '活动创建成功！',
											title : '提示'
										});
										datagrid.datagrid('reload');
									}
								} catch (e) {
									$.messager.show({
										msg : '活动创建失败！',
										title : '提示'
									});
								}
							}
						});
					}else{
						actForm.form('submit', {
							url : '/activity/save',
							success : function(data) {
								try {
									var d = $.parseJSON(data);
									if (d) {
										actDialog.dialog('close');
										$.messager.show({
											msg : '活动创建成功！',
											title : '提示'
										});
										datagrid.datagrid('reload');
									}
								} catch (e) {
									$.messager.show({
										msg : '活动创建失败！',
										title : '提示'
									});
								}
							}
						});
					}
				
				}
			} ]
		}).dialog('close');
		datagrid=$('#datagrid').datagrid({  
		    url:'/activity/datagrid',
			frozenColumns : [ [ {
				title : 'id',
				field : 'id',
				width : 50,
				checkbox : true
			}, {
				field : 'title',
				title : '活动名称',
				width : 150,
				sortable : true
			} ] ],  
		    columns:[[  
		        {field:'address',title:'活动地点',width:220},
		        {field:'startTime',title:'开始时间',width:150,
		        	formatter: function(value,row,index){
						return removeDotZero(value);
				}},  
		        {field:'endTime',title:'结束时间',width:150,
		        	formatter: function(value,row,index){
						return removeDotZero(value);
				}}  
		    ]]  
		}); 
	});

	var append = function() {
		actForm.form('clear');
		actDialog.dialog('open');
	}
	var edit = function(){
		var rows=datagrid.datagrid('getSelections');
		if(rows.length>1){
			$.messager.show({msg : '只能选择一行进行编辑！', title : '提示'});
			return false;
		}else if(rows.length<1){
			$.messager.show({msg : '请选择要编辑的记录！', title : '提示'});
			return false;
		}else{
			actDialog.dialog('open');
			actForm.form('clear');
			var row=rows[0];
			actForm.find('#id').val(row.id);
			actForm.find('#title').val(row.title);
			actForm.find('#address').val(row.address);
			actForm.find('#startTime').datetimebox('setValue',row.startTime);
			actForm.find('#endTime').datetimebox('setValue',row.endTime);
		}
	}
	var removeFun = function(){
		var ids = [];
		var rows = datagrid.datagrid('getSelections');
		if (rows.length > 0) {
			$.messager.confirm('请确认', '您要删除当前所选项目？', function(r) {
				if (r) {
					for ( var i = 0; i < rows.length; i++) {
						ids.push(rows[i].id);
					}
					$.ajax({
						url : '/activity/delete/'+ids,
						dataType : "json",
						success : function(response) {
							datagrid.datagrid('unselectAll');
							datagrid.datagrid('reload');
							$.messager.show({
								title : '提示',
								msg : '删除成功！'
							});
						}
					});
				}
			});
		} else {
			$.messager.alert('提示', '请选择要删除的记录！', 'error');
		}
	}
	var unselectAll = function(){
		datagrid.datagrid('unselectAll');
	}
</script>
</body>
</html>